<!doctype html>
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
<meta name="layout" content="common">
<title>Manage Merchants</title>

<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.8.2/css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="${resource(dir:'css', file:'demo_table.css') }">
<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="${resource(dir:'js', file:'jquery.dataTables.min.js') }"></script>
</head>
<body id="body">
	<h2>Manage Merchants</h2>
	<hr />

	<g:if test="${flash.message}">
		<div class="alert alert-success">
			<img src="${resource(dir:'images', file:'icon_successful.png') }" />&nbsp;&nbsp;${flash.message}
		</div>
	</g:if>
	<div class="row>">
		<g:form name="SearchMerchant" method="POST" action="search">
		<table width="100%">
			<tr>
				<td width="25%">Name</td>
				<td>
					<g:textField name="searchName" value="${searchName}" maxLength="100" style="width:220px;"/>
				</td>
			</tr>
			<tr>
				<td>Country</td>
				<td>
					<g:select name="searchCountry" from="${countryList.name}" keys="${countryList.id}" value="${searchCountry}" noSelection="['':'-- Please Select --']" />
				</td>
			</tr>
			<tr>
				<td>Categories</td>
				<td>
					<g:select name="searchCategory" from="${catList.name}" keys="${catList.id}" value="${searchCategory}" noSelection="['':'-- Please Select --']" />
				</td>
			</tr>
			<tr>
				<td>
					<label for="status">
						<g:message code="user.status.label" default="Status" />
					</label>
				</td>
				<td>
					<g:select name="searchStatus" from="${com.mastercard.labs.Merchant$Status?.values()}" keys="${com.mastercard.labs.Merchant$Status.values()*.name()}" value="${searchStatus}" noSelection="['':'-- Please Select --']" />
				</td>
			</tr>
			<tr>
				<td></td>
				<td>
					<g:submitButton name="search" value="Search" class="btn btn-primary" />&nbsp;
					<g:actionSubmit action="update" value="Create New Merchant" class="btn" />
				</td>
			</tr>
		</table>
		<br/><br/>
		<g:if test="${searchCondition}">
		<table cellpadding="0" cellspacing="0" border="0" class="display" width="95%" id="merchantList">
			<thead>
				<tr>
					<td width="5%"><b>SN</b></td>
					<td><b>Name</b></td>
					<td width="25%"><b>Country</b></td>
					<td width="20%"><b>Status</b></td>
					<td width="10%"><b>Logo</b></td>
				</tr>
			</thead>
			<tbody>
				<g:each in="${merchantInstanceList}" var="merchant" status="merchantStat">
					<tr class="gradeA" id="transaction-row-${merchant.id }">
						<td>${merchantStat + 1}</td>
						<td><g:link action="update" id="${merchant.id}" params="[searchCondition: searchCondition]">${fieldValue(bean: merchant, field: "name")}</g:link></td>
						<td>${fieldValue(bean: merchant, field: "country.name")}</td>
						<td>${fieldValue(bean: merchant, field: "status")}</td>
						<td><g:img uri="${fieldValue(bean: merchant, field: "logo")}" height="30" width="30" /></td>
					</tr>
				</g:each>
			</tbody>
		</table>
		</g:if>
		
		<g:hiddenField name="searchCondition" value="${searchCondition}"/>
		</g:form>
	</div>
	<br/>
	<script src="${resource(dir:'js/app', file:'merchant_search.js') }"></script>
</body>
</html>